<template>
	<basic-container class="log" v-loading="loading" element-loading-text="数据加载中...">
		<dataList
			ref="log"
			hideFilterBtn
			openIndex
			operaColumnWidth="120"
			:pageInfo="pager"
			:listData="tableData"
			:dataInfo="dataInfo"
			:operaInfo="operaInfo"
			:menuList="[]"
			:listLayout="['menu','filter']"
			:filterList="filterList"
			@btn-click="handleBtnClick"
		></dataList>
		<v-dialog :show.sync="dialogVisible" width="1000px" title="查看">
			<el-form ref="tableOption" :model="tableOption" label-width="80px" class="form-wrap">
				<el-form-item label="登录时间" prop="createTime">
					<span class="in_txt">{{tableOption.createTime}}</span>
				</el-form-item>
				<el-form-item label="登录名" prop="username">
					<span class="in_txt">{{tableOption.username}}</span>
				</el-form-item>
				<el-form-item label="证件号" prop="idcard">
					<span class="in_txt">{{tableOption.idcard}}</span>
				</el-form-item>
				<el-form-item label="登录类型" prop="type">
					<span class="in_txt">{{getInit(tableOption.type,typeList)}}</span>
				</el-form-item>
				<el-form-item label="请求参数" prop="paras" class="full">
					<span class="in_txt">{{tableOption.paras}}</span>
				</el-form-item>
				<el-form-item label="是否实名认证" prop="paras" class="full">
					<span class="in_txt">{{tableOption.isverified=='0'?'是':'否'}}</span>
				</el-form-item>
				<el-form-item label="登录结果" prop="result">
					<span class="in_txt">{{getInit(tableOption.result,resultList)}}</span>
				</el-form-item>
				<el-form-item label="备注" prop="remarks" class="full">
					<span class="in_txt">{{tableOption.remarks}}</span>
				</el-form-item>
			</el-form>
		</v-dialog>
	</basic-container>
</template>

<script>
	import {fetchList } from '~/admin/api/login-log'
	export default {
		name: "sms",
		provide () {
			return {
				initList: this.getListData
			};
		},
		beforeMount () {
			this.getListData()
			//this.methodList = this.getDict('method_type')
		},
		data () {
			return {
				tableData: [],
				// 请求参数
				params: {
					current: 1,
					size: 10
				},
				// 分页
				pager: {
					total: 0, // 总页数
					current: 1, // 当前页数
					size: 10 // 每页显示多少条
				},
				filterList: [
					{ label: '登录名', inputType: 'input', name: 'username', placeholder: '请输入登录名或证件号', defaultValue: '' },
					{ label: '登录类型', inputType: 'select', name: 'type',children:[{value:'1',label:'电脑端'},{value:'2',label:'智慧福田'},{value:'3',label:'政务通'}], multiple:false, defaultValue: ''},
					//{ label: '操作人', inputType: 'input', name: 'createBy', placeholder: '请输入操作人', defaultValue: '' }
					{ label: '登录时间', inputType: 'daterange', name: ['createTimeStart','createTimeEnd'],  defaultValue: ['',''] },
				],
				// 页面loading
				loading: false,
				// 弹窗
				dialogVisible: false,
				tableOption: {
					createTime: '',
					username: '',
					idcard: '',
					type: '',
					paras: '',
					isverified: '',
					result: '',
					remarks: ''
				},
				// 字典
				typeList: [{value:'1',label:'电脑端'},{value:'2',label:'智慧福田'},{value:'3',label:'政务通'}],
				resultList: [{value:'1',label:'成功'},{value:'2',label:'失败'}]
			}
		},
		computed: {
			//权限
			permissionList (scope) {
				return {
					//delBtn: true,//;this.getPermissions('sys_log_del'),
					getBtn:true,// this.getPermissions('sys_log_view')
				}
			},
			//数据表头
			dataInfo () {
				return [
					{ label: '登录时间', prop: 'createTime', width: '180' },
					{ label: '登录名', prop: 'username', width: '220' },
					{ label: '证件号', prop: 'idcard', width: '200' },
					{ label: '登录类型', prop: 'type', width: '100',formatter: this.dataFormatter },
					{ label: '请求参数', prop: 'paras', width: '250' , 'show-overflow-tooltip': true },
					{ label: '是否实名认证', prop: 'isverified', width: '100' ,formatter: this.dataFormatter},
					{ label: '登录结果', prop: 'result', width: '100' ,formatter: this.dataFormatter},
					{ label: '备注', prop: 'remarks', width: '250' , 'show-overflow-tooltip': true },

				]
			},
			//操作按钮
			operaInfo () {
				return [
					{ label: '查看', name: 'look', verify: () => this.permissionList.getBtn },
					// { label: '删除', name: 'del', verify: () => this.permissionList.delBtn },
				]
			}
		},
		methods: {
			// 获取列表
			getListData (params = {}) {
				this.loading = true;
				let requestData = { ...this.params, ...params };
				let obj = {}
				for (let key in requestData) {
					if ((requestData[key] === 0 || requestData[key]) && requestData[key].toString().replace(/(^\s*)|(\s*$)/g, '') !== '') {
						obj[key] = requestData[key]
					}
				}
				requestData = obj
				fetchList(requestData)
					.then(res => {
						const { total, current, size, records } = res.data.data;
						this.tableData = records;
						this.params = requestData;
						this.pager = { total, current, size };
					})
					.finally(() => {
						this.loading = false;
					});
			},
			// 按钮点击监听
			handleBtnClick ({ type, row }) {
				switch (type) {
					case 'look':
						this.handleLook(row)
						break;
					//case 'del':
				  //	this.rowDel(row)
					//	break;
					default:
						break
				}
			},
			// 请求方式初始化
			initMethod (row, column, callValue) {
				let obj = this.methodList.find(it => it.value === callValue)
				if (obj) {
					return obj.label
				}
				return ''
			},
			// 删除
			/*
			rowDel (row) {
				this.$confirm('是否确认删除ID为"' + row.id + '"的日志?', '警告', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(function () {
					return delObj(row.id)
				}).then(data => {
					this.getListData({ current: 1 })
					this.$message.success('删除成功')
				})
			},
			*/
			// 查看
			handleLook (row) {
				this.tableOption = row
				this.dialogVisible = true
			},
			//字典项取值
			getInit (num, sum) {
				let obj = sum.find(it => it.value === num)
				if (obj) {
					return obj.label
				}
				return ''
			} ,
			dataFormatter (row, column, cellValue) {
				switch (column.property) {
					case 'type': //
						let type = this.typeList.find(i => i.value === cellValue)
						return type?.label || ''
					case 'result': //结果
						let result = this.resultList.find(i => i.value === cellValue)
						return result?.label || ''
					case 'isverified':
						return cellValue=='0'?"是":"否";
					default:
						return cellValue
				}
			},
		}
	}
</script>

<style scoped lang="scss">
	.log {
		@include formWrap(2);
		.in_txt {
			color: #999;
		}
	}
</style>
